<!DOCTYPE html>
<html lang="zh-CN">
 <head> 
  <#include "../head.html" />
	<link href="${base}/res/bootstrap/css/bootstrap-spinner.css" rel="stylesheet">
	<script src="${base}/res/bootstrap/js/jquery.spinner.min.js"></script>
 </head> 
 <body>
   <#include "../layout/top.html" />
   <div class="container bs-docs-container"> 
  <div class="row"> 
   <#include "../layout/left-menu.html" />
   <div class="col-md-9" role="main"> 
    <!-- NAVI --> 
    <ul class="nav nav-tabs" id="PageTab"> 
     <li class="active"><a href="#" data-toggle="tab" onclick="manage();" aria-expanded="true">基本设置</a></li> 
     <li id="manual_tab" class=""><a href="#" data-toggle="tab" onclick="manual(1,false);" aria-expanded="false">回帖内容</a></li>
     <li id="rec_tab" class=""><a href="#" data-toggle="tab" onclick="rec(1,false);" aria-expanded="false">回帖记录</a></li>
    </ul>  
    <br /> 
    <!-- END NAVI --> 
    <!-- PAGE1: ADMINID--> 
    <div id="manage" class="tab-pane fade active in"> 
     	<div class="alert alert-warning" role="alert">
     	温馨提示：<br>
       	1.目前最多支持3个贴吧，云回帖有封号危险，请慎用!<br>
       	2.水经验：每天6次随机回复某个贴吧中的帖子 <br>
       	3.刷贴盖楼：指定帖子进行回复盖楼，时间间隔默认为1分钟 <br>
       	4.贴吧id和帖子id均用英文,隔开，顺序对应，如果随机回贴请用帖子id输入0 <br>
       	5.回帖前请先关注该贴吧 <br>
     	</div>
	    <form id="reply_form" class="form-horizontal" role="form">
		   <div class="form-group">
		      <label class="col-sm-2 control-label">请选择账号</label>
		      <div class="col-sm-10">
		      	  <input type="hidden" name="reply.guid" value="${(bean.guid)!}" />
			      <select name="reply.bdGuid" onchange="changeAc(this)">
			         <#list bds as bd>
						<option value="${bd.guid}" <#if bd.guid = bdGuid>selected="selected"</#if>>${bd.nickName}</option>
					</#list>
			      </select>
		      </div>
		   </div>
		   <div class="form-group">
		      <label class="col-sm-2 control-label">回帖模式</label>
		      <div class="col-sm-10">
		         <div class="checkbox">
		            <label>
		               <input type="radio" name="reply.replyMod"
		               	<#if !bean??>
		                checked="checked"
		                </#if>
		                <#if bean?? && bean.replyMod = 0>
		                checked="checked"
		                </#if>
		                value="0"> 水经验
		               &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		               <input type="radio" name="reply.replyMod"
		                <#if bean?? && bean.replyMod = 1>
		                checked="checked"
		                </#if>
		                value="1"> 盖楼顶贴
		            </label>
		         </div>
		      </div>
		   </div>
		   <div class="form-group">
		      <label class="col-sm-2 control-label">客户端</label>
		      <div class="col-sm-10">
		         <select name="reply.clientType">
					 <option value="0">随机</option>		         	
			         <#list clientList as client>
						<option value="${client.code}" <#if bean?? && bean.clientType = client.code>selected="selected"</#if>>${client.description}</option>
					 </#list>
			      </select>
		      </div>
		   </div>
		  <div class="form-group">
		    <label for="inputPassword" class="col-sm-2 control-label">贴吧名称</label>
		    <div class="col-sm-8">
		      <input type="text" class="form-control" name="reply.tbNames"
		         placeholder="请输入贴吧名称" value="${(bean.tbNames)!}">
		    </div>
		  </div>
		  <div class="form-group">
		    <label for="inputPassword" class="col-sm-2 control-label">帖子tid</label>
		    <div class="col-sm-8">
		      <input type="text" class="form-control" name="reply.tid"
		         placeholder="请输入帖子id" value="${(bean.tid)!}">
		    </div>
		  </div>
		  <div class="form-group">
		      <label class="col-sm-2 control-label">回帖数</label>
		      <div class="col-sm-10">
		         <div class="input-group spinner" data-trigger="spinner" id="spinner" style="width: 15%">
					<input type="text" class="form-control" name="reply.replyNum" value="${(bean.replyNum)!'6'}" data-max="999" data-min="1" data-step="1">
					<div class="input-group-addon">
						<a href="javascript:;" class="spin-up" data-spin="up"><i class="icon-sort-up"></i></a>
						<a href="javascript:;" class="spin-down" data-spin="down"><i class="icon-sort-down"></i></a>
					</div>
				</div>
		      </div>
		   </div>
		  <div class="form-group">
		      <label class="col-sm-2 control-label">回帖内容</label>
		      <div class="col-sm-10">
		         <div class="checkbox">
		            <label>
		               <input type="radio" name="reply.content"
		               	<#if !bean??>
		                checked="checked"
		                </#if>
		                <#if bean?? && bean.content == 0>
		                checked="checked"
		                </#if>
		                value="0"> 默认
		               &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		               <input type="radio" name="reply.content"
		                <#if bean?? && bean.content == 1>
		                checked="checked"
		                </#if>
		                value="1"> 自定义
		            </label>
		         </div>
		      </div>
		   </div>
		  <div class="form-group">
		      <div class="col-sm-offset-2 col-sm-10">
		         <button id="sdsada" type="button" class="btn btn-info ladda-button" data-style="expand-left" onclick="replySet(this);">立即生效</button>
		      </div>
		   </div>
		</form>
		<div class="panel panel-default">
			<div class="panel-heading" onclick="$('#win_tid').fadeToggle();"><h3 class="panel-title"><span class="glyphicon glyphicon-chevron-down"></span> 如何查看帖子tid</h3></div>
			<div class="panel-body" id="win_tid" style="display: none;">
			    1.通过浏览器访问要回复的帖子
			    <br><br>2.如图所示，
			    <a href="${base}/res/bootstrap/doc/tid.png" target="_blank"><img src="${base}/res/bootstrap/doc/tid.png"></a>
			    <br><br>3.<b>http://tieba.baidu.com/p/4227383471</b>&nbsp;&nbsp;&nbsp;&nbsp;<font color="red">p/</font>后面的一串数字就是帖子的tid
			</div>
		  </div>
		</div>
    </div> 
	<!-- PAGE1：END -->
	<!-- PAGE2: ADMINID--> 
    <div id="manual" class="tab-pane fade active in"> 
    	<select id="manual_select_id" onchange="manual(1,false)">
         <#list bds as bd>
			<option value="${bd.guid}" <#if bd.guid = bdGuid>selected="selected"</#if>>${bd.nickName}</option>
		</#list>
        </select>
        <br>
	    <table class="table table-striped" style="width: 70%">
	     <thead> 
	      <tr> 
	       <th style="width:10%">序号</th> 
	       <th style="width:80%">回帖内容</th>
	       <th style="width:10%">操作</th> 
	      </tr> 
	     </thead> 
	     <tbody id="manage_tbody_id">
	     </tbody> 
	    </table>
	    <ul id="pagination-demo" class="pagination" style="float: right;">
	  	 <!--  <li><a href="#">&laquo;</a></li>
		  <li><a href="#">1</a></li>
		  <li><a href="#">2</a></li>
		  <li><a href="#">3</a></li>
		  <li><a href="#">4</a></li>
		  <li><a href="#">&raquo;</a></li> -->
		</ul>
    </div> 
	<!-- PAGE2：END -->
	<!-- PAGE3: ADMINID--> 
    <div id="rec" class="tab-pane fade active in"> 
    	<select id="rec_select_id" onchange="rec(1,false)">
         <#list bds as bd>
			<option value="${bd.guid}" <#if bd.guid = bdGuid>selected="selected"</#if>>${bd.nickName}</option>
		</#list>
        </select>
        <br>
	    <table class="table table-striped" style="width: 70%">
	     <thead> 
	      <tr> 
	       <th style="width:10%">序号</th> 
	       <th style="width:15%">回复状态</th>
	       <th style="width:40%">帖子链接</th> 
	       <th style="width:25%">回复时间</th> 
	      </tr> 
	     </thead> 
	     <tbody id="rec_tbody_id">
	     </tbody> 
	    </table>
	    <ul id="pagination-rec" class="pagination" style="float: right;"></ul>
    </div> 
	<!-- PAGE3：END -->
   </div> 
  </div>  
  </div>
 <script type="text/javascript">
 $(function(){
	 manage();
 });
 function manage(){
	 $('#manage').css('display','');
	 $('#manual').css('display','none');
	 $('#rec').css('display','none');
 }
 function manual(pageNo,flag){
	 //手动绑定
	 $('#manage').css('display','none');
	 $('#rec').css('display','none');
	 $('#manual').css('display','');
	 $.ajax({
		type : 'POST', 
      	dataType :"json",
      	contentType: "application/json; charset=utf-8",
        data : {},
		url : "${base}/baidu/getReplyContent?pageNo="+pageNo+"&pageSize=5&bdGuid="+$("#manual_select_id").val(),
		success : function(data){
			$("#manage_tbody_id").html("");
			if(data.status == 200){
				var htmStr = "";
				if(data.data.page != null){
					var x = (data.data.page.pageNumber-1)*data.data.page.pageSize+1;
					$.each(data.data.page.list, function(index,ob){
						htmStr += "<tr>";
						htmStr += "<td>" + x++ + "</td>";
						if(data.data.reply != null && data.data.reply.content == 1){
							htmStr += "<td><textarea rows='3' maxlength='200' class='form-control' >"+ ob.content +"</textarea></td>";
							htmStr += "<td><a class='btn btn-info' href='javascript:void(0);' onclick='update(\""+ ob.id +"\",this);'>保存</a></td>";
						}else{
							htmStr += "<td><textarea rows='3' maxlength='200' class='form-control'  disabled='disabled'>"+ ob.content +"</textarea></td>";
							htmStr += "<td><a class='btn btn-warning' href='javascript:void(0);'>系统默认</a></td>";
						}
					});
					$("#manage_tbody_id").html(htmStr);
					//生成js分页
					if(!flag){
						$('#pagination-demo').remove();
						$("#manual").append("<ul id='pagination-demo' class='pagination' style='float: right;'></ul>");
					}
					$("#pagination-demo").twbsPagination({
				        totalPages: data.data.page.totalPage,
				        visiblePages: 5,
				        href: 'javascript:manual({{pageNumber}},true);',
				        hrefVariable: '{{pageNumber}}'
				    });
				}else{
					$('#pagination-demo').remove();
					$("#manage_tbody_id").html(htmStr);
				}
			}else{
				layer.msg(data.message,{icon: 2});
			}
		}
	});
 }
 function update(id,ob){//更新自定义回帖内容
	var content = $(ob).parent().parent().find("textarea").eq(0).val();
	 $.ajax({
		type : 'POST', 
      	dataType :"text",
        data :  "id="+id+"&content="+content,
		url : "${base}/baidu/updateRec",
		success : function(data){
			var da = eval( "(" + data + ")" );
			if(da.status == 200){//更新成功
				layer.msg(da.message,{icon: 1});
			}else{
				layer.msg(da.message,{icon: 2});
			}
		}
	});
 }
 function rec(pageNo,flag){//查看回帖记录
	 $('#manage').css('display','none');
	 $('#manual').css('display','none');
	 $('#rec').css('display','');
	 $.ajax({
		type : 'POST', 
      	dataType :"json",
      	contentType: "application/json; charset=utf-8",
        data : {},
		url : "${base}/baidu/getRec?pageNo="+pageNo+"&bdGuid="+$("#rec_select_id").val(),
		success : function(data){
			$("#rec_tbody_id").html("");
			if(data.status == 200){
				var htmStr = "";
				if(data.data.page != null){
					var x = (data.data.page.pageNumber-1)*data.data.page.pageSize+1;
					$.each(data.data.page.list, function(index,ob){
						htmStr += "<tr>";
						htmStr += "<td>" + x++ + "</td>";
						if((ob.msg).indexOf("成功") != -1){
							htmStr += "<td><span class='label label-success'>"+ob.msg+"</span></td>";
						}else{
							htmStr += "<td><span class='label label-danger'>"+ob.msg+"</span></td>";
						}
						htmStr += "<td><a href='"+ob.url+"' target='_blank'>"+ob.url+"</a></td>";
						htmStr += "<td>"+ob.replyTime+"</td>";
					});
					$("#rec_tbody_id").html(htmStr);
					//生成js分页
					if(!flag){
						$('#pagination-rec').remove();
						$("#rec").append("<ul id='pagination-rec' class='pagination' style='float: right;'></ul>");
					}
					$("#pagination-rec").twbsPagination({
				        totalPages: data.data.page.totalPage,
				        visiblePages: 10,
				        href: 'javascript:rec({{pageNumber}},true);',
				        hrefVariable: '{{pageNumber}}'
				    });
				}else{
					$('#pagination-rec').remove();
					$("#rec_tbody_id").html(htmStr);
				}
			}
		}
	});
 }
 function replySet(ob){
	var l = Ladda.create(ob);
	l.start();
	 $.ajax({
		type : 'POST', 
      	dataType :"text",
        data :  $("#reply_form").serializeObject(),
		url : "${base}/baidu/replySet",
		success : function(data){
			var da = eval( "(" + data + ")" );
			if(da.status == 200){//设置成功
				layer.msg(da.message,{icon: 1},function(){
					l.stop();
					location.href="${base}/baidu/reply";
				});
			}else{
				layer.msg(da.message,{icon: 2});
			}
		}
	});
 }
 function changeAc(ob){
	location.href="${base}/baidu/reply?bdGuid="+$(ob).val();
 }
 </script>
 </body>
</html>